<!--同步考核数据 机构奖惩|人员奖惩-->
<template>
  <el-dialog
    top="5vh"
    class="bonus fix-height"
    :title="title"
    :visible.sync="visible"
    width="60%"
    :close-on-click-modal="false">
    <div class="search-form">
      <el-form ref="formRef" :model="formData" label-width="80px">
        <el-form-item label="统计周期">
          <el-select v-model="formData.obtain" placeholder="请选择统计周期" @change="periodChange" class="w100">
            <el-option v-for="item in periodOptions" :label="item.tjmc" :value="item.id" :key="item.id"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
    </div>
    <el-table
          :data="tableData"
          :height="'calc(100vh - 330px)'"
          v-loading="loading"
          border>
          <el-table-column prop="" label="序号" width="55" align="center" header-align="center">
            <template slot-scope="scope">
               <span>{{scope.$index + 1}}</span>
            </template>
          </el-table-column>
          <el-table-column
            v-if="type == 'ry'"
            prop="personCode"
            label="人员编号"
            align="center"
            width="180">
          </el-table-column>
          <el-table-column
            v-if="type == 'ry'"
            prop="personName"
            label="人员名称"
            align="center"
            width="180">
          </el-table-column>
          <el-table-column
            v-if="type == 'jg'"
            prop="deptName"
            label="机构名称"
            align="center"
            width="180">
          </el-table-column>
        <el-table-column
          v-if="type == 'jg'"
          prop="deptCode"
          label="机构编号"
          show-overflow-tooltip
          min-width="130">
        </el-table-column>
        <el-table-column
          prop="deptRatio"
          width="150"
          show-overflow-tooltip
          align="center"
          header-align="center"
          label="机构（单位）系数">
        </el-table-column>
        <el-table-column
          prop="assessItem"
          min-width="350"
          header-align="center"
          align="center"
          show-overflow-tooltip
          label="考核项">
        </el-table-column>
        <el-table-column
          prop="assessDate"
          width="110"
          header-align="center"
          align="center"
          show-overflow-tooltip
          label="考核时间">
        </el-table-column>
        <el-table-column
          prop="assessScore"
          width="90"
          header-align="center"
          align="center"
          show-overflow-tooltip
          label="考核得分">
        </el-table-column>
        <el-table-column
          prop="assessGrade"
          width="90"
          header-align="center"
          align="center"
          show-overflow-tooltip
          label="考核评级">
        </el-table-column>
        <el-table-column
          prop="enableStatus"
          align="center"
          min-width="90"
          label="启用状态">
          <template slot-scope="scope">
            <span>{{ scope.row.enableStatus == 0 ? '启用' : '停用' }}</span>
          </template>
        </el-table-column>
      </el-table>

     <div slot="footer" class="dialog-footer">
        <el-button @click="handleCancel(false)">取消</el-button>
        <el-button type="primary" @click="handleSubmit" :loading="saveLoading">确定</el-button>
     </div>
  </el-dialog>
</template>

<script>
import {saveAssementList,getPeriodDic,getDataByPeriod} from '@/api/bonus/dataorgassessment'
export default {
  name: "asscessForm",
  data(){
    return{
      title:'同步考核数据',
      visible:false,
      loading:false,
      saveLoading:false,
      type:'', //人员 ry 机构 jg
      formData:{},
      periodOptions:[],
      tableData:[]
    }
  },
  methods:{
    //获取考核数据
    init(type){
      this.type = type
      this.visible=true
      this.getPeriodDic()
    },
    getPeriodDic(){
      getPeriodDic().then(res=>{
        this.periodOptions=res.data.data
      })
    },
    handleSubmit(){
      this.saveLoading = true ;
      saveAssementList(this.tableData,this.type).then(res=>{
        if(res.data.code==0){
          this.$message.success("同步成功!")
          this.handleCancel(true)
        }
        this.saveLoading = false ;
      }).catch(err => {
        this.saveLoading = false ;
      })
    },
    //选择考核周期
    periodChange(){
      if (!this.formData.obtain) return
      this.loading = true ;
      getDataByPeriod(this.formData.obtain.replace(/-/g,''),this.type).then(res=>{
        this.tableData=res.data.data
        this.loading = false
      }).catch(err=>{
        this.loading = false
      })
    },
    handleCancel(refresh){
      this.visible = false ;
      this.tableData = [] ;
      this.formData.obtain = '' ;
      if (refresh){
        this.$emit('refresh')
      }
      this.$refs.formRef.resetFields() ;
    }
  }
}
</script>

<style scoped>
/deep/.el-form{width: 500px}
/deep/.el-form .el-form-item {width: 100%}
.w100{width: 100%}
</style>
